import 'dart:math';

import 'package:flutter/material.dart';

class AnimatedListRoute extends StatefulWidget {
  const AnimatedListRoute({Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => _AnimatedListRouteState();
}

class _AnimatedListRouteState extends State<AnimatedListRoute> {
  final _data = <String>[];

  int counter = 5;

  final _listKey = GlobalKey<AnimatedListState>();

  final Tween<Offset> _tween =
      Tween<Offset>(begin: const Offset(1, 0), end: const Offset(0, 0));

  @override
  void initState() {
    super.initState();
    for (var i = 0; i < counter; i++) {
      _data.add('$i');
    }
  }

  Widget myListItem(String text, Animation animation) {
    return SlideTransition(
      position:
          animation.drive(CurveTween(curve: Curves.bounceOut)).drive(_tween),
      child: Container(
        margin: const EdgeInsets.symmetric(vertical: 3.0),
        constraints: BoxConstraints.tight(const Size(double.infinity, 70)),
        alignment: Alignment.center,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Text(
              '  $text ',
              style: const TextStyle(color: Colors.white, fontSize: 32),
            ),
            IconButton(
              icon: const Icon(Icons.delete_forever, color: Colors.white),
              onPressed: () {
                int index = _data.indexOf(text);
                _data.removeAt(index);
                _listKey.currentState!.removeItem(
                    index, (context, animation) => myListItem(text, animation),
                    duration: const Duration(milliseconds: 200));
              },
            ),
          ],
        ),
        color: Colors.primaries[int.parse(text) % Colors.primaries.length],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Animated List'),
      ),
      body: Center(
        child: Stack(
          children: [
            AnimatedList(
              key: _listKey,
              initialItemCount: _data.length,
              itemBuilder: (context, index, animation) =>
                  myListItem(_data[index], animation),
            ),
            Positioned(
              bottom: 30,
              right: 10,
              child: FloatingActionButton(
                heroTag: '删除',
                onPressed: () {
                  var data = _data.last;
                  var index = _data.length - 1;
                  _data.remove(data);
                  _listKey.currentState!.removeItem(index,
                      (context, animation) => myListItem(data, animation),
                      duration: const Duration(milliseconds: 200));
                },
                child: const Icon(Icons.remove),
              ),
            ),
            Positioned(
              bottom: 30,
              right: 70,
              child: FloatingActionButton(
                heroTag: '添加',
                onPressed: () {
                  int num = Random().nextInt(1000);
                  _data.add('$num');
                  int index = _data.lastIndexOf('$num');
                  _listKey.currentState!.insertItem(index,
                      duration: const Duration(milliseconds: 200));
                },
                child: const Icon(Icons.add),
              ),
            )
          ],
        ),
      ),
    );
  }
}
